<script setup lang="ts">
import { ref,onMounted} from 'vue'
import axios from 'axios'
import {MerchantAccount} from '../type/MerchantAccount'

const updatecenterDialogVisible = ref(false);
const Admins=ref<MerchantAccount[]>([])
const tableData = ref<MerchantAccount[]>([])

onMounted(() => {
    axios.get('http://localhost:8080/admin/selectAllExamineMerchant').then((response) => {
        console.log(response.data)
        Admins.value = response.data.data
    })
})

const openUpdateDialog = (row:any) => {
    console.log(row)
    updatecenterDialogVisible.value = true
    tableData.value=row
}
const submit = () => {
    axios.post('http://localhost:8080/admin/examine/merchant',tableData.value).then((res) => {
     if  (res.data.code===200){ 
      axios.get('http://localhost:8080/admin/selectAllByStatus').then(res=>{
        console.log(res.data)
        Admins.value=res.data.data
    })
    }
    })
}
</script>


<template>
  <el-table :data="Admins" style="width: 100%">
    <el-table-column prop="id" label="编号" width="180"/>
    <el-table-column prop="username" label="账户名" width="180"/>
    <el-table-column prop="merchantName" label="店铺名" width="180"/>
    <el-table-column prop="applyTime" label="提交时间"  width="180"/>
    <el-table-column prop="isExamine" label="审核状态" width="180">
      <el-tag type="warning">未审核</el-tag>
     </el-table-column>
    <el-table-column label="操作" width="180">
        <template #default="scope">
      <el-button type="primary" size="small" @click="openUpdateDialog(scope.row)">
        详情
      </el-button>
    </template>
    </el-table-column>
  </el-table>
  <el-dialog class="shop-dialog" v-model="updatecenterDialogVisible" title="Warning">
      <template #header>
        <span>详情</span>
      </template>
      <template #default>
        <el-form label-width="100px" :model="tableData">
          <el-form-item label="账号">
            <el-input v-model="tableData.username" disabled />
          </el-form-item>
          <el-form-item label="头像">
            <el-image  :src="`http://localhost:9000/img/${tableData.userTouxiang}`" style="width: 100px; height: 100px"/>
          </el-form-item>
          <el-form-item label="手机号">
            <el-input v-model="tableData.phone" disabled />
          </el-form-item>
          <el-form-item label="商家介绍">
            <el-input v-model="tableData.merchantIntroduction" disabled />
          </el-form-item>
          <el-form-item label="商铺头像">
            <el-input v-model="tableData.touxiang" disabled />
          </el-form-item>
          <el-form-item label="商铺背景图">
            <el-input v-model="tableData.bg" disabled />
          </el-form-item>
          <el-form-item label="商铺地址">
            <el-input v-model="tableData.position" disabled />
          </el-form-item>
          <el-form-item label="提交审核时间">
            <el-input v-model="tableData.applyTime" disabled />
          </el-form-item>
          <el-form-item label="审核状态">
            <el-select v-model="tableData.isExamine">
              <el-option
                label='未审核'
                :value=0
              />
              <el-option
                label='通过'
                :value=1
              />
              <el-option
                label='不通过'
                :value=2
              />
            </el-select>
          </el-form-item>
          <el-form-item label="不通过原因" v-if="tableData.isExamine==2">
            <el-input type="textarea" v-model="tableData.remark" placeholder="请输入不通过原因"/>
          </el-form-item>
        </el-form>
      </template>
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="updatecenterDialogVisible = false">取消</el-button>
          <el-button type="primary" @click="submit; ">确认修改</el-button>
        </div>
      </template>
    </el-dialog>
</template>

<style scoped>

</style>
